<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head>


    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>秒杀</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
    <script th:src="@{/js/jquery-2.1.4.min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/web/seckill.js}"></script>
    <script>
        $(function () {
            $("a[data]").click(function () {
                var productId = $(this).attr('data');
                $("[name=product_id]").val(productId);
                $("form").submit();
            });
        })
    </script>
</head>

<body>
<form action="/cart" method="post">
    <input name="product_id" type="hidden">
    <input name="user_id" type="hidden" th:value="${session.loginUser.id}">
</form>
<div class="panel panel-primary">
    <!--<div class="panel-heading">-->
        <!--<h3 class="panel-title">面板标题</h3>-->
    <!--</div>-->
    <div class="panel-body">
        <table class="table table-bordered">
            <caption>商品列表</caption>
            <thead>
            <tr>
                <th>ID</th>
                <th>名称</th>
                <th>价格</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="p:${pages.content}">
                <td>
                    <a th:href="@{'/product/'+${p.id}}" th:text="${p.id}"></a>
                </td>
                <td th:text="${p.name}">Bangalore</td>
                <td th:text="${p.price}">560001</td>
                <td>
                    <a href="javascript:;" th:data="${p.id}">加到购物车</a>
                </td>
            </tr>
            </tbody>
        </table>
        <ul class="pagination">
            <li  th:class="${i==pages.number+1?'active':''}"
                 th:each="i:${#numbers.sequence(1,pages.totalPages)}">
                <a th:href="${'/product/list?page='+(i-1)}" th:text="${i}">4</a>
            </li>
        </ul>
    </div>
</div>

</body>
</html>
